Declutter status UI: dot-only state, click-to-open characters - #11
Merged
Conversation
Session header: remove the redundant "Connected" state pill from the top-right. Each tab already shows a coloured connection-state dot next to the character name (SessionTabs), so the pill duplicated it. Dropped the now-unused StateClass/StateLabel helpers. Worlds page character rows: the badge + name + a single status dot are now the primary click target — clicking opens the live session if there is one, else connects (PrimaryActionAsync). Removed the separate "Open" button and the "Connected" text pill (now a coloured .sc-state-dot), and folded the "Connect" button into the label click. Edit/delete icons remain. Updated WorldManagerTests to drive connect via the label (.sc-char-main) instead of .sc-connect-btn. Also removed dead --sc-cols-width JS that a merge re-introduced into measureGrid (nothing consumes it since the min-width column track was dropped). Web + Android build clean; UI bUnit suite 46/46. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01HHCRc5CJ6595iMzEgYYdQp
There was a problem hiding this comment.
Pull request overview
UI polish to simplify connection-status visuals and streamline primary actions in the Worlds/Session UI by removing redundant status elements and making character rows open/connect via the label area.
Changes:
- WorldManager character rows: consolidate open/connect into a single primary click target (
.sc-char-main) and display a single state dot. - Session header: remove the redundant “Connected” state pill and drop the now-unused
StateClass/StateLabelhelpers. - Housekeeping: remove unused
--sc-cols-widthpublication frommeasureGridand update bUnit tests to use.sc-char-main.
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| tests/SharpClient.UI.Tests/WorldManagerTests.cs | Updates selectors/click target to match the new character-row primary action area. |
| src/SharpClient.UI/wwwroot/sc-interop.js | Removes publishing of the unused --sc-cols-width CSS variable from measureGrid. |
| src/SharpClient.UI/wwwroot/app.css | Adds styling for the new .sc-char-main primary click target and hover behavior. |
| src/SharpClient.UI/Components/WorldManager.razor | Reworks character-row UI to be dot-only status and click-to-open/connect behavior. |
| src/SharpClient.UI/Components/SessionScreen.razor | Removes redundant header connection-state pill and related helper methods. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+75
to
+80
| <div class="sc-char-main" @onclick="() => PrimaryActionAsync(world, character)" | ||
| title="@(activeSession is not null ? "Open session" : "Connect")"> | ||
| <div class="sc-char-badge">@Initial(character.Name)</div> | ||
| <div class="sc-char-name">@character.Name</div> | ||
| <span class="sc-state-dot" style="background:@StateColor(charState)" title="@charState"></span> | ||
| </div> |
|
|
||
| .sc-char-row { display: flex; align-items: center; gap: 11px; padding: 10px 14px; border-top: 1px solid var(--bd); } | ||
| /* The badge + name + status dot form the primary click target (open the session, or connect). */ | ||
| .sc-char-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 11px; cursor: pointer; } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Follow-up UI polish.
Session header
SessionTabs), so the pill just duplicated it.StateClass/StateLabelhelpers.Worlds page — character rows
PrimaryActionAsync)..sc-state-dot, grey when disconnected), and folded the "Connect" button into the label click.Housekeeping
--sc-cols-widthJS that a merge re-introduced intomeasureGrid(nothing consumes it since themin-widthcolumn track was dropped in the horizontal-scroll fix).WorldManagerTeststo drive connect via the label (.sc-char-main) instead of the removed.sc-connect-btn.Verification
🤖 Generated with Claude Code